<!-- 全部案场 -->
<template>
  <div class="all_build position-relative">
    <div ref="allbuildRef" :style="{ height: onresizeHeight + 'px', overflow: 'auto', paddingRight: '10px' }">
      <div @click="changeLeftBar(item)" v-for="(item, index) in data" :key="index">
        <Row class="item_build">
          <Col span="22">
            <Row>
              <Col span="11">
                <div>
                  <span class="build_alise">{{ item.housesName || '-' }}</span>
                  （{{ item.status }}）
                  <span
                    :class="[
                      'caseRateBg',
                      `caseRateBg${item.grade && item.grade == '暂无' ? 'W' : item.grade}`
                    ]"></span>
                </div>
              </Col>
              <Col span="11">
                <div class="first_col">
                  <span class="lable">合作模式：</span>
                  {{ item.cooperationMode || '-' }}
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="22">
                <div>
                  <span class="lable">组织结构：</span>
                  {{ item.caseLocation || '-' }}
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">所属城市：</span>
                  <span class="item_content">{{ item.city || '-' }}</span>
                </div>
              </Col>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">产品类型：</span>
                  <span class="item_content">{{ buildingTypeSwitch(item.products) }}</span>
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">团队：</span>
                  <span class="item_content">{{ item.teams || '-' }}</span>
                </div>
              </Col>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">主委：</span>
                  <span class="item_content">{{ item.chairMan || '-' }}</span>
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">专案：</span>
                  <span class="item_content">{{ item.project || '-' }}</span>
                </div>
              </Col>
              <Col span="11">
                <div class="item_warp">
                  <span class="lable">女专：</span>
                  <span class="item_content">{{ item.womenCollege || '-' }}</span>
                </div>
              </Col>
            </Row>
          </Col>
          <Col span="2">
            <div class="star_icon hand">
              <Icon :type="item.isConcern ? 'ios-star' : 'ios-star-outline'" @click.stop="changeStar(item)" />
            </div>
          </Col>
        </Row>
      </div>
      <div class="no_data" v-if="data.length == 0">暂无案场数据</div>
    </div>
    <dt-loading :loading="loading" />
    <!-- 分页 -->
    <page
      :pageData="pageData"
      @pageOnChangeFun="pageOnChangeFun"
      @pageOnPageSizeChangeFun="pageOnPageSizeChangeFun"></page>
  </div>
</template>
<script>
  import store from '@/store'
  import { buildPage } from '@/router/buildPage.js'
  import buildMgr from '@/biz/building'
  import caseMgr from '@/biz/crimeSceneList'
  export default {
    props: {
      onresizeHeight: {
        type: Number,
        default: () => {
          return '600'
        }
      }
    },
    data() {
      return {
        pageData: {
          total: 0,
          current: 1,
          rows: 10,
          pageSizeOpts: [10, 20, 30, 40, 50]
        },
        orgId: '',
        formValidate: {},
        data: [],
        orgSwitch: '',
        loading: false,
        timer: null,
        btnFlag: false,
        notOrg: false
      }
    },
    methods: {
      //产品类型映射
      buildingTypeSwitch(productType) {
        if (!productType || productType.length == 0) return '-'
        productType = Array.from(new Set(productType))
        let newArr = []
        let arr = this.$dt.dictInfo().productType
        for (let i = 0; i < arr.length; i++) {
          productType.map((itemL) => {
            if (itemL == arr[i].key) {
              newArr.push(arr[i].value)
            }
          })
        }
        return newArr.join('、')
      },
      initData(obj, formValidate, orgFlag) {
        this.loading = true
        let params = {
          caseLocationId: obj.caseLocationId, //案场所属 组织id
          departmentCode: obj.departmentCode,
          cityId: formValidate.cityId[1], //所属城市
          housesId: formValidate.housesId, //案场主键Id
          housesName: formValidate.housesName, //案场名称
          cooperationMode: formValidate.cooperationMode, //合作模式
          page: this.pageData.current,
          rows: this.pageData.rows,
          salesManager: formValidate.salesManager, //销售经理
          status: formValidate.status, //案场状态
          userId: formValidate.userId,
          orgSwitch: orgFlag,
          notOrg: this.notOrg
        }
        caseMgr
          .buildinghousesList(params)
          .then((res) => {
            if (!res || res.length < 1) {
              this.data = []
              this.pageData.total = 0
              this.loading = false
              return false
            }
            this.loading = false
            this.data = res.list
            this.pageData.total = res.total - 0
          })
          .catch(() => {
            this.loading = false
            this.data = []
            this.pageData.total = 0
          })
      },

      //搜索
      getBuildList(orgId, formValidate, pageNum, orgFlag, notOrg) {
        console.log(orgId, formValidate, pageNum, orgFlag)
        this.orgSwitch = orgFlag
        this.notOrg = notOrg
        this.orgId = orgId
        this.formValidate = formValidate
        this.pageData.current = pageNum ? pageNum : this.pageData.current
        this.initData(orgId, formValidate, orgFlag)
      },
      //关注案场
      changeStar(obj) {
        let _this = this
        if (this.btnFlag) {
          this.$Message.info('请不要频繁操作')
          return false
        }
        this.btnFlag = true
        clearTimeout(_this.timer)
        _this.timer = setTimeout(() => {
          let checkObj = JSON.parse(JSON.stringify(obj))
          let params = {
            housesId: checkObj.housesId,
            isConcern: !checkObj.isConcern,
            userId: this.formValidate.userId,
            orgSwitch: this.orgSwitch
          }
          this.loading = true
          caseMgr.housesConcern(params).then((res) => {
            this.btnFlag = false
            this.$emit('changeStarStatus')
            let mess = !checkObj.isConcern ? '您已成功关注案场' : '您已取消关注案场'
            this.$Message.success(mess)
          })
        }, 1000)
      },
      //跳转
      changeLeftBar(item) {
        console.log(item, '案场详情')
        buildMgr.updateBuildInfo(item)
        this.$tool.setStorage({ caseBuildingId: JSON.stringify(item.housesId) })
        store.dispatch('setRouterList', buildPage)
        let allBuildScrollH = this.$refs.allbuildRef.scrollTop
        this.$tool.setStorage({ allBuildScrollH: allBuildScrollH })
        this.$router.push({
          path: '/buildingHome/statistics'
        })
      },
      //分页触发
      pageOnChangeFun() {
        this.initData(this.orgId, this.formValidate, this.orgSwitch)
      },
      //分页触发
      pageOnPageSizeChangeFun() {
        this.initData(this.orgId, this.formValidate, this.orgSwitch)
      }
    },
    activated() {
      this.$refs.allbuildRef.scrollTo(0, this.$tool.getStorage('allBuildScrollH'))
    }
  }
</script>
<style lang="scss" scoped>
  .all_build {
    // padding-right: 5px;
    .item_build {
      padding: 10px 15px;
      border: 1px solid #ccc;
      line-height: 35px;
      font-size: 15px;
      margin-bottom: 16px;

      .build_alise {
        font-size: 20px;
        line-height: 45px;
      }

      .lable {
        display: inline-block;
        width: 100px;
        text-align: right;
      }

      .first_col {
        margin-top: 10px;
      }

      .star_icon {
        font-size: 40px;
        color: #2d8cf0;
      }
    }

    .item_warp {
      display: flex;
      justify-content: flex-start;

      .item_content {
        flex: 1;
      }
    }

    .no_data {
      font-size: 16px;
      text-align: center;
    }

    .empty-data {
      font-size: 28px;
      top: 40px;
      width: 100%;
    }
  }

  .caseRateBg {
    display: inline-block;
    width: 93px;
    height: 33px;

    vertical-align: -8px;
  }
  .caseRateBgA {
    background: url('https://static.tospurfang.com/dt-management/caseRate/ALevel.png') no-repeat;
    background-size: 100% 100%;
  }
  .caseRateBgB {
    background: url('https://static.tospurfang.com/dt-management/caseRate/BLevel.png') no-repeat;
    background-size: 100% 100%;
  }
  .caseRateBgC {
    background: url('https://static.tospurfang.com/dt-management/caseRate/CLevel.png') no-repeat;
    background-size: 100% 100%;
  }
  .caseRateBgD {
    background: url('https://static.tospurfang.com/dt-management/caseRate/DLevel.png') no-repeat;
    background-size: 100% 100%;
  }
  .caseRateBgW {
    background: url('https://static.tospurfang.com/dt-management/caseRate/WLevel.png') no-repeat;

    background-size: 100% 100%;
  }
</style>
